﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="testChat.aspx.cs" Inherits="chat.chatControl.testChat" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <!-- codigo que incluir para que funcione el chatControl -->
    <link href="./style.css" media="screen" rel="stylesheet" type="text/css" />

    <script src="./jquery-1.2.6.min.js" type="text/javascript"></script>

    <!-- <script src="./chatcontrol/chat.js" type="text/javascript"></script> -->
    <!-- codigo que incluir para que funcione el chatControl -->
</head>
<body>

    <script type="text/javascript">
        $(document).ready(
    function() {

        $("#message").change(function(e) {
            // alert('dsfd'); // $(this).blur();
        }); // message.change        


        $("form").submit(function() {
            // event.preventDefault();
        //alert('Handler for .submit() called.');


            $.ajax({
            beforeSend: function (XMLHttpRequest) {
            XMLHttpRequest.setRequestHeader("Content-Type", "application/json");
             },
            type: "GET",
            url: "processmessage.aspx",
            data: "message=" + $('#message').val() + "&name=" + $('#name').val() + "",
            dataType: "text",
            success: function(msg){ $("#myDiv").text( "Data Received: " + msg ); }
            }); // end of ajax




// si queremos utilizar json
//   data: "{"
//                    + "'message':'" + $('#message').val() + "',"
//                    + "'name':'" + $('#name').val() + "',"
//                    + "}",
//            dataType: "json",
  
  
//            $.ajax({
//                type: "POST",
//                url: "processmessage.aspx",
//                contentType: "application/json; charset=utf-8",
//                data: "{'test':'" + $('#message').val() + "'}",

//                dataType: "json",
//                success: AjaxSucceeded,
//                error: AjaxFailed
//            }); // end of ajax
//            
            




            // alert('Handler for .submit() called.');
            // we clean the message textbox and focus it..
            $('#message').val("");
            $('#message').focus();

            return false;

        });
    })

        setInterval(function() {
            $.ajax({
                success: function(request) {
                    $('#chat').html(request);
                },
                url: 'data.aspx',
                cache: false
            })
        }, 1000)


        function AjaxSucceeded(result) {
            alert(result.d);
        }
        function AjaxFailed(result) {
            alert(result.status + ' ' + result.statusText);
        }  
        
        
</script>

    <form id="form1" runat="server">
    <div>
        <h1>
            Chat con jquery unobtrusivo.</h1>
        <div id="chat">
        </div>
        <div class="footer">
            <a href="http://www.carakan.com" title="desarrollo web 2.0">original idea from carakan</a></div>
        <div class="footer">
            <a href="http://www.micasoft.net" title="desarrollo web 2.0">final idea from Luis Molina</a></div>
    </div>
        <form action="process.aspx" method="post">
             <input id="name" name="name" size="10" type="text" />
            <input id="message" name="message" size="10" type="text" class="message" />
            <input id="commit" name="commit" value="Enviar" type="submit" />
            <a name="aref" href="#.">Click</a>
         </form> 
     
     
     </form>
   
   
    
    
  
  
    
    
</body>
</html>
